<template>
  <div class="problem_conclude">
    <el-dialog
      title="QMS处理结论"
      width="600px"
      v-dialogDrag
      :close-on-click-modal="false"
      :visible.sync="dialogVisible"
      @close="close"
      customClass="mes_dialog">
      <div class="conclude_info">
        <p>周转码：<span>{{turnoverNumber}}</span></p>
        <p>发起工序：<span>{{workstageName}}</span></p>
        <p>发起人：<span>{{submitterName}}</span></p>
      </div>
      <div class="conclusion">
        <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="100px">
          <el-form-item label="处理原因：" prop="problemProcessReasonSelect">
            <el-select v-model.trim="ruleForm.problemProcessReasonSelect" multiple @change="multipleChange" size="small"
                       placeholder="请选择">
              <el-option
                v-for="item in problemProcessReason.labels"
                :key="item.id"
                :label="item.label"
                :value="item.id">
              </el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="处理意见：" prop="remarks" class="distance">
            <el-input
              type="textarea"
              placeholder="请输入内容"
              rows="6"
              resize="none"
              v-model.trim="ruleForm.remarks">
            </el-input>
          </el-form-item>
          <div class="plan_number">
            <el-form-item label="计划数量：">
              <span>{{planNumber}}</span>
            </el-form-item>
          </div>
          <div class="detail_conculde">
            <el-form-item label="返工：" prop="reworkQuantity" class="rework">
              <el-input v-model.trim.number="ruleForm.reworkQuantity" size="small" placeholder="请输入返工数量"></el-input>
            </el-form-item>
            <el-form-item label="返修：" prop="repairQuantity" class="rework">
              <el-input v-model.trim.number="ruleForm.repairQuantity" size="small" placeholder="请输入返修数量"></el-input>
            </el-form-item>
            <el-form-item label="报废：" prop="scrapQuantity" class="form-item item-bottom item-group">
              <el-input v-model.trim.number="ruleForm.scrapQuantity" size="small" placeholder="请输入报废数量"
                        @change="handleScrap"></el-input>
            </el-form-item>
            <el-form-item label="重投：" porp="restartQuantity" class="form-item">
              <el-input v-model.trim.number="ruleForm.restartQuantity" size="small" placeholder="请输入重投数量"
                        @change="handleRestart"></el-input>
            </el-form-item>
          </div>
        </el-form>
      </div>
      <span slot="footer" class="mes_btn">
        <el-button type="primary" @click="submitHandle">提 交</el-button>
        <el-button @click="close">关 闭</el-button>
      </span>
    </el-dialog>
  </div>
</template>

<script>
export default {
  name: 'ProblemConclude',
  data() {
    return {
      num: 0,
      dialogVisible: false,
      turnoverId: '', // 周转批次ID
      workstageReturn: [], // 返回工序
      planNumber: '', // 计划数量
      listId: '', // 列表ID
      turnoverNumber: '', // 周转码
      workstageName: '', // 发起工序
      submitterName: '', // 发起人
      problemReasonList: [],
      selectData: [],
      ruleForm: {
        problemProcessReasonSelect: [], // 处理原因
        remarks: '', // 问题描述
        workstageId: '', // 返工工序D
        repairWorkstageId: '', // 返修工序D
        reworkQuantity: '', // 返工数量
        repairQuantity: '', // 返修数量
        scrapQuantity: '', // 报废数量
        restartQuantity: '' // 重投数量
      },
      rules: {
        problemProcessReasonSelect: [
          {required: true, message: '请选择处理原因', trigger: 'blur'}
        ],
        remarks: [
          {required: true, message: '请输入处理意见', trigger: 'blur'}
        ],
        reworkQuantity: [
          {validator: this.isPosInteger, message: '返工数量必须是正整数', trigger: 'blur'},
        ],
        repairQuantity: [
          {validator: this.isPosInteger, message: '返修数量必须是正整数', trigger: 'blur'},
        ],
        scrapQuantity: [
          {validator: this.isPosInteger, message: '报废数量必须是正整数', trigger: 'blur'},
        ],
        restartQuantity: [
          {validator: this.isPosInteger, message: '重投数量必须是正整数', trigger: 'blur'},
        ],
      },
    }
  },
  computed: {
    // 处理原因
    problemProcessReason() {
      return this.$store.state.dict.problemProcessReason || []
    },
  },
  methods: {
    multipleChange(list) {
      this.problemReasonList = list.reduce((pre, cur) => [...pre, {
        reasonId: cur
      }], [])
    },
    openDialog(data) {
      this.dialogVisible = true
      this.listId = data[0].id
      this.turnoverId = data[0].turnoverId
      this.planNumber = data[0].productionQuantity ? data[0].productionQuantity : data[0].inputQuantity
      this.turnoverNumber = data[0].turnoverNumber
      this.workstageName = data[0].workstageName
      // this.ruleForm.reworkstageId = data[0].workstageId
      // this.ruleForm.repairWorkstageId = data[0].workstageId
      this.ruleForm.reworkstageId = data[0].batchWorkstageId
      this.ruleForm.repairWorkstageId = data[0].batchWorkstageId
      this.submitterName = data[0].submitterName
      // this.getReturnProceduce()
    },
    // 改变重投数量
    handleRestart() {
      if (!this.ruleForm.scrapQuantity) {
        this.ruleForm.scrapQuantity = this.ruleForm.restartQuantity
      }
      if (this.ruleForm.restartQuantity > this.ruleForm.scrapQuantity) {
        this.ruleForm.restartQuantity = this.ruleForm.scrapQuantity
      }
    },
    // 改变报废数量
    handleScrap() {
      if (this.ruleForm.restartQuantity > this.ruleForm.scrapQuantity) {
        this.ruleForm.restartQuantity = this.ruleForm.scrapQuantity
      }
    },
    // 计算总值<=计划数量
    cala() {
      let reworkQuantity = this.ruleForm.reworkQuantity || 0
      let repairQuantity = this.ruleForm.repairQuantity || 0
      let scrapQuantity = this.ruleForm.scrapQuantity || 0
      let restartQuantity = this.ruleForm.restartQuantity || 0
      let planNumber = this.planNumber
      let bool = false

      if (restartQuantity > scrapQuantity) {
        this.tipMessage('error', '重投数量不能大于报废数量')
        // 返工+返修+重投
      } else if (reworkQuantity + repairQuantity > planNumber) {
        this.tipMessage('error', '数量总和不能大于计划数量')
        // 返工+返修+报废
      } else if (reworkQuantity + repairQuantity + scrapQuantity > planNumber) {
        this.tipMessage('error', '数量总和不能大于计划数量')
        // 返工+返修+重投
      } else if (reworkQuantity + repairQuantity + restartQuantity > planNumber) {
        this.tipMessage('error', '数量总和不能大于计划数量')
      } else {
        bool = true
      }
      return bool
    },
    // 提交
    submitHandle() {
      this.$refs['ruleForm'].validate((valid) => {
        if (valid) {
          if (!this.cala()) {
            return
          }
          let postData = {
            method: 'post',
            url: 'a/workstageproblemprocess/workstageProblemProcess/qmsprocessresult',
            data: {
              problemResult: {
                problemId: this.listId,
                remarks: this.ruleForm.remarks,
                reworkWorkstageId: this.ruleForm.reworkstageId,
                repairWorkstageId: this.ruleForm.repairWorkstageId,
                repairQuantity: this.ruleForm.repairQuantity || 0,
                reworkQuantity: this.ruleForm.reworkQuantity || 0,
                scrapQuantity: this.ruleForm.scrapQuantity || 0,
                restartQuantity: this.ruleForm.restartQuantity || 0,
              },
              problemQMSId: this.listId,
              // 处理原因的参数
              problemReasonList: this.problemReasonList
            },
            noCommit: true
          }
          return this.$store.dispatch('saveData', postData).then(() => {
            this.$emit('submitSuccess')
            this.tipMessage('success', '提交成功')
            this.dialogVisible = false
          })
        }
      })
    },
    // 是否是正整数
    isPosInteger(rule, num, callback) {
      if (num && !/^[0-9]*[1-9][0-9]*$/.test(num)) {
        callback(new Error(rule.message))
      } else {
        callback()
      }
    },
    // 关闭
    close() {
      this.$refs['ruleForm'].resetFields()
      this.dialogVisible = false
      this.ruleForm.restartQuantity = ''
    },
    /**
     * 提示
     * @param str 提示内容
     */
    tipMessage(type, str) {
      this.$message({
        type: type,
        message: str,
        duration: 1500,
        center: true
      })
    }
  }
}
</script>

<style lang="less">
  .problem_conclude {
    .conclusion {
      padding: 20px;
      label.el-form-item__label {
        text-align: right;
      }
      .el-form-item {
        margin-bottom: 20px;
        .el-form-item__content {
        }
      }
      .detail_conculde {
        .el-form-item.rework {
          /*margin-bottom: 15px;*/
          /*width: 40%;*/
          /*display: inline-block;*/
        }
        .el-form-item.rework_sel {
          /*width: 59%;*/
          /*display: inline-block;*/
          /*.el-form-item__content {*/
          /*margin-left: 0 !important;*/
          /*}*/
        }
      }
      .plan_number .el-form-item {
        margin-bottom: 0 !important;
      }
      .distance {
        margin-bottom: 10px !important;
      }
      .el-select.el-select--small {
        width: 100%;
      }
    }
    .conclude_info {
      display: flex;
      align-items: center;
      justify-content: space-around;
      box-sizing: border-box;
      background-color: #ebf0f6;
      height: 30px;
      line-height: 30px;
    }
    .el-dialog__body {
      padding: 0 !important;
    }
  }
</style>
